<%@ page language="java" contentType="text/html; charset=UTF-8"   pageEncoding="UTF-8"%>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%
	String basePath = request.getScheme()+"//"+request.getServerName()+":"+request.getServerPort()+request.getContextPath();
	String servletPath = request.getServletPath();
%>

<!DOCTYPE html>
<html>
<%@include file="../../common.jsp"%>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>${goods.name}</title>
<style type="text/css">
<!--
.spec.clicked{
	color: black;
}
.tabm a{
	cursor: pointer;
}
.swiper-wrapper img{
	height: 100%;
}
#detail img{
	width: 100%;
	min-height:20px;
	vertical-align:top; 
	display:block;
}
#share_div{
	font-size: 16px;
	position:  absolute;
	
}
#share_img{
	cursor: pointer;
}
.swiper-slide img{
	width: 100%;
	height: auto;
}
#goods_time{
	background: #2196f3 url(${staticPath}/images/time-spike.png)  10px 0px no-repeat;
    text-indent: 35px;
    font-size: 14px;
    color: #333333;
    line-height: 22px;
}
.colorp00 em{
	font-style: normal;
}
.spec-hl-bg {
    background-color: #ffe6e6;
    display: inline-block;
}
.goodsSpec .spec.em_disabled  {
    border: 1px dashed #ccc;
    cursor: not-allowed;
    color: #999;
}
.attrDescDiv{
    width: 96%;
    height: auto;
    margin: 10px 5px;
    border: #999 1px solid;
}
.attrDescDiv ul,.attrDescDiv li{
    margin: 0;
    padding: 0;
    list-style: none;
}
.attrDescDiv ul li{
    /*width: 98%;*/
    line-height: 20px;
    margin-left: 24px;
    margin-top: 10px;
    font:12px/1.3 'Arial','Microsoft YaHei'; _font-family:simsun;color:#333;
}
 -->
</style>
</head>
<body>
<header class="contHeader" >
    <div class="contOHeader" style="z-index: 1000">
        <h1>商品详情</h1>
        <div class="contOHeadBack" onclick="javascript:history.go(-1);"><a href="javascript:void(0);" ><img src="${staticPath}/images/back2.png"></a></div>
        <!-- 
        <div class="contOHeadgwc"><a href="#"  onclick=""><img src="${staticPath}/images/share2.png"></a></div>
         -->
        <div class="contOHeadgwc"><a href="javascript:void(0);"  id="cart_link"><img src="${staticPath}/images/gwc.png"></a></div>
    </div>
</header>
<div class="swiper-container">
      <!-- Additional required wrapper -->
      <div class="swiper-wrapper">
        <!-- Slides -->
        <c:choose>
        	<c:when test="${goodsImageList!=null&&fn:length(goodsImageList)>0}">
		        <c:forEach items="${goodsImageList}" var="goodsImage" varStatus="index">
		        	<c:if test="${index.index==0}">
			        	<c:set var="shareImage"  value="${goodsImage.imgurl}" />
		        	</c:if>
			        <div class="swiper-slide"><img src="${goodsImage.imgurl}"  style="min-height: 100px;"></div>
		        </c:forEach>
        	</c:when>
        	<c:otherwise>
	        	<c:set var="shareImage"  value="${goods.image}" />
			    <div class="swiper-slide"><img src="${goods.image}" ></div>
        	</c:otherwise>	
        </c:choose>
      </div>
      <!-- If we need pagination -->
      <div class="swiper-pagination"></div>
    </div>
    <div class="weui_panel weui_panel_access">
      <div class="weui_panel_bd">
        <div class="weui_media_box weui_media_text" >
          <div class="weui_media_title" style="width: 90%;float: left">
          	${goods.title}
          	<br/>
          	<span style="font-size: 13px;white-space:normal">${goodsSku.subTitle}</span>
          </div> 
          <div id="share_app" style="width: 10%;float: left; display: none;"><img alt="" src="${staticPath}/images/share2.png"></div>
          <div id="share_link" style="width: 10%;float: left;"> <a href="javascript:;"  data-target="share_div"><img alt="" src="${staticPath}/images/share2.png" id="share_img"> </a> </div>
	      <div id="share_div" style="display: none;position: absolute; width:100%; background-color: white;height: 50px;">
	       	<div class="jiathis_style_m" style="float: left"></div>
	       	<div  style="float: left"> <a  style="font-size: 18px;" id="share_hide" href="javascript:void(0);" class="weui_btn weui_btn_mini weui_btn_default">关闭</a></div>
	      </div>
        </div>
        <div style="clear: both;"> </div>
		<c:if test="${goodsTimeInfo!=null}">
	       	<div id="goods_time" style="min-height: 30px;">
	       		<c:choose>
	        		<c:when test="${'1'==goodsTimeInfo[0]}">
		        		<span class="limit_msg">距离开始抢购还有</span>
	        		</c:when>
	        		<c:when test="${'2'==goodsTimeInfo[0]}">
		        		<span class="limit_msg">距离结束还有</span>
	        		</c:when>
	        		<c:when test="${'3'==goodsTimeInfo[0]}">
		        		<span class="limit_msg">抢购已结束</span>
	        		</c:when>
	       		</c:choose>
	       		<span>
	       			<span id="time_span"></span>
	       		</span>
	       	</div>
      	</c:if>
        <div id="sku_prices_div" style="min-height: 30px">
        
        </div>
         <input type="hidden" id="skuCombinationsStr" value='${skuCombinationsStr}'/>
         <input type="hidden" id="goodsSkuSpecId" value="${goodsSku.specId}"/>
        <c:if test="${goodsSpecList!=null}">
	       <div class="weui_media_box">
	         <p class="weui_media_desc" style="float:left;">已选规格：<span id="choosedSpecCombination">${goodsSku.specName}</span></p>
	       </div>
	       <c:forEach items="${goodsSpecList}" var="goodsSpec">
	       <div class="weui_media_box">
	         <p class="weui_media_desc" style="float:left;width:100%;">${goodsSpec.specClass.name}：</p>
	         <!-- 
	         <span id="spec${goodsSpec.specClass.id}" class="goodsSpec" specId="${goodsSpec.specClass.id}" specName="${goodsSpec.specClassName}">
	          -->	
	         <span id="spec${goodsSpec.specClass.id}" class="goodsSpec" specId="${goodsSpec.specClass.id}" specName="${goodsSpec.specClass.name}">
				<c:set var="temKey" value="goodsSpec${goodsSpec.id}"/>
				<c:forEach items="${goodsSpecMap[temKey]}" var="specValue">
					<a href="javascript:void(0);" class="spec weui_btn weui_btn_mini weui_btn_default" id="spceValue${specValue.id}" specValueId="${specValue.id}" specValueName="${specValue.specName}" >${specValue.specName}</a>
				</c:forEach>
	         </span>
	       </div>
		   </c:forEach>
        </c:if>
        <c:if test="${goodsSku.state!=3}">
	        <div style="border-bottom:1px #d9d9d9 solid;padding-left:15px;line-height:30px;">
	        <label style="color:#9b9b9b;font-size:14px;"></label>
	        </div>
        </c:if>
        <img src="${staticPath}/images/sell1.png" style="height:25px;padding-left:10px;">
        <img src="${staticPath}/images/sell2.png" style="height:25px;">
        <img src="${staticPath}/images/sell3.png" style="height:25px;">
        <div class="weui_media_box">
          <p class="weui_media_desc" style="float:left;width:100%;">购买数量：</p>
           <input type="text" class="spinner" id="goods_num" />
        </div>
        <p class="colorp00" style="font-size:14px; padding: 5px 15px ;">库存：<em id="sku_inventory_em"></em>&nbsp;<em>件</em>
			<span style="color:#ed610c;">销量：<em>${goodsSku.salenum==null?0:goodsSku.salenum}&nbsp;</em>件</span>
		</p>
        <div class="weui_media_box weui_media_text">
          <c:choose>
           <c:when test="${goods.evaluationCount!=null&&goods.evaluationCount>0}">
	          <p class="weui_media_desc" style="float:left;">累计评价：${goods.evaluationCount}</p>
	          <a href="<%=appPath%>/comments/list.html?goodsId=${goods.id}" style="font-size:12px;float:right;">查看全部</a>
           </c:when>
           <c:otherwise>
	          <p class="weui_media_desc" style="float:left;">「暂无评价」</p>
           </c:otherwise>
          </c:choose>
        </div>
        
        <div class="weui_media_box weui_media_small_appmsg">
          <div class="weui_cells weui_cells_access">
	        <c:forEach items="${pagedComments.content}" var="comment">
	            <a class="weui_cell" href="javascript:;">
	              <div class="weui_cell_hd"><img src="${comment.member.avatar}" onerror="javascript:this.src='${staticPath}/images/nologin.png'" alt="" style="width:20px;margin-right:5px;display:block;float:left;">
	                <p class="font12 float">${comment.member.name}</p><img src="${comment.member.dealer!=null?comment.member.dealer.dealerLevel.imgUrl:memberLevelImageUrl}" class="star"> 
	                <!-- <img src="images/star.png" class="star"><img src="images/star.png" class="star"> -->
	                <br>
	                <p class="weui_media_desc">${comment.content}</p><br>
	                <p class="weui_media_desc"><fmt:formatDate value="${comment.addtime}" type="both" />   </p>
	              </div>
	            </a>
			</c:forEach>
          </div>
        </div>
        <div class="weui_media_box">
          <p class="weui_media_desc" style="text-align:center;width:100%;">图文详情</p>
        </div>
        <div class="attrDescDiv">
          <ul>
            <li>产品名称：${goods.name}</li>
            <%--
            <c:forEach items="${goodsAttrList}" var="goodsAttr">
             <li>${goodsAttr.attrClassName }：${goodsAttr.attrValueName }</li>
            </c:forEach>
             --%>
            <c:forEach items="${attrClassIds}" var="attrClassId">
            	<c:set var="temKey" value="attrClass${attrClassId}"></c:set>
            	 <c:forEach items="${goodsAttrMap[temKey]}" var="goodsAttr" varStatus="index">
            	 	 <c:choose>
            	 	 <c:when test="${index.index==0}">
             	 	 <c:set var="className" value="${goodsAttr.attrClassName}"/>
             	 	 <c:set var="attrValueName" value="${goodsAttr.attrValueName}"/>
            	 	 </c:when>
            	 	 <c:otherwise>
             	 	 <c:set var="attrValueName" value="${attrValueName}、${goodsAttr.attrValueName}"/>
            	 	 </c:otherwise>
            	 	 </c:choose>
            	 </c:forEach>
             <li>${className}：${attrValueName }</li>
            </c:forEach>
          </ul>
        </div>
        <div id="detail">
          ${goodsDeail}
        </div>
      </div>
    </div>
    <div class="clear" id="footer_space_div" style="clear: both;" ></div>
    <div class="tabm" id="tabm_div" style="z-index: 1000">
    	<input type="hidden" id="share_image" value="${shareImage}"  />
    	<input type="hidden" id="goods_title" value="${goods.title}"  />
    	<input type="hidden" id="goods_id" value="${goods.id}"  />
    	<input type="hidden" id="sku_id" value="${goodsSku.id}"  />
    	<input type="hidden" id="sku_inventory" value="${goodsSku.inventory}"  />
    	<input type="hidden" id="goods_inventory" value="${goods.inventory}"  />
    	<input type="hidden" id="sku_state" value="${goodsSku.state}" /> 
    	<input type="hidden" id="goods_time_info_state" value="${goodsTimeInfo[0]}" /> 
  		<input type="hidden" id="goods_time_info_sec" value="${goodsTimeInfo[1]}" /> 
        <div class="conttjleft" style="width:${goodsSku.state==3?'40%':'30%'}">
			<a target="_blank" href="javascript:kefu();">
				<img src="${staticPath}/images/service.png">
				<p>客服</p>
			</a>
		</div>
		<%--
        <div class="conttjleft"><a id="save_favorite" href="javascript:void(0)" ><img src="${staticPath}/images/souc.png"><p>收藏</p></a></div>
		 --%>
        <c:choose>
        	<c:when test="${goodsSku.state==3}">
		        <div class="conttjright" style="width: 60%"><a id="point_buy"href="javascript:void(0)" >积分兑换</a></div>
        	</c:when>
        	<c:otherwise>
		        <div class="conttjmid" style="width: 35%"><a  id="save_in_cart" href="javascript:void(0)" >加入购物车</a></div>
		        <div class="conttjright" style="width: 35%"><a id="single_buy"href="javascript:void(0)" >立即购买</a></div>
        	</c:otherwise>
        </c:choose>
    </div>
</body>
 <script src="${staticPath}/weui/js/swiper.js"></script>
 <script src="${staticPath}/js/jquery.spinner.js"></script> 
 <script src="${staticPath}/js/app/cart/cart.js"></script> 
 <script src="${staticPath}/js/jquery.lazyload.js"></script>
 <script src="${staticPath}/js/app/goods/detail-options.js"></script> 
 <script type="text/javascript" src="${staticPath}/js/ueditor/ueditor.parse.js"></script>
 <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> 
 <script src="${staticPath}/js/app/goods/wx-share.js"></script> 
 <script type="text/javascript" src="http://v3.jiathis.com/code/jiathis_m.js" charset="utf-8"></script>
 
</html>